@import '~/common/style/index.scss';
$contact-prefix-cls: #{$cui-prefix}-contactItem;

.#{$contact-prefix-cls}{
    height: 74px;
    // background: #E6F5FF;
    display: flex;
    align-items: center;
    // padding: 12px;
    box-sizing: border-box;
    margin: 4px 0;
    &-nickname{
        margin: 0 12px;
        font-size: 16px;
        line-height: 24px;
        /* identical to box height, or 150% */
        color: #171A1C;
        flex: 1;
        overflow: hidden;
    }
    // &:hover{
    //     background: #F9FAFA;
    // }
    // &:active{
    //     background-color: #E3E6E8;;
    // }
    // &-selected{
    //     background-color: #E6F5FF !important;
    //     .#{$contact-prefix-cls}-nickname{
    //         color: #009EFF;
    //     }
    // }
}

$contact-tag-prefix-cls: #{$cui-prefix}-contactItem-tag;

.#{$contact-tag-prefix-cls}{
    display: flex;
    height: 24px;
    padding: 2px 12px 0.5px 12px;
    margin: 4px 0;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 1.5px;
    border-bottom: 1px solid $gray-9;
}

.#{$contact-prefix-cls}-dark{
    border-bottom: 1px solid $gray-2;
    color: $gray-98;
}